<template>
    <div id="risk-management-control" class="w-h-100 pos-r flex-1 apply-container page-public-s" style="box-sizing: border-box;overflow:hidden;">
        <el-row class="w-h-100" :gutter="10">
            <el-col :xs="24" :sm="4" :md="4" :lg="4" :xl="4" class="w-h-100">
                <el-button style="width: 100%; margin-bottom: 10px;"> 风险分区 </el-button>
                <div style="box-sizing: border-box;" class="flex-1 pos-r w-h-100">
                    <div class="pos-a w-h-100" style="box-sizing: border-box;">
                        <el-card style="overflow-y: auto;" class="box-card w-h-100" shadow="never">
                            <div style="" class="w-h-100 ver-flex">
                                <div class="flex-1 pos-r">
                                    <div class="pos-a w-h-100">
                                        <div class="w-h-100">
                                            <ul>
                                                <li class="area-l" v-for="item in areaInfo" :key="item.id" @click="liClick(item)" :class="{ 'active': selectedItem === item.id }">{{ item.v_Name }}</li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </el-card>
                    </div>
                </div>
            </el-col>

            <el-col :xs="24" :sm="20" :md="20" :lg="20" :xl="20" class="w-h-100">
                <div class="w-h-100 ver-flex pos-a" style="box-sizing: border-box;width: 83%;overflow: hidden;">
                    <div v-if="$hasPer('RiskControl:batchStart') || $hasPer('RiskControl:batchEnd') || $hasPer('RiskControl:batchUpload') || $hasPer('RiskControl:batchDown') || $hasPer('RiskControl:excel')" style="box-sizing: border-box;">
                        <el-card shadow="never" :body-style="{ paddingBottom: '0' }">
                            <el-form class="box-f" ref="queryForm" :inline="true">
                                <el-form-item >
                                    <el-button v-if="$hasPer('RiskControl:excel')" @click="handleExport" icon="ele-Download"> 导出数据 </el-button>
                                    <!-- <el-button @click="nodeClick()" icon="ele-Plus" type="primary"> 新增 </el-button> -->
                                    <el-button v-if="$hasPer('RiskControl:batchStart')" @click="syncHandle(getData)" icon="ele-Refresh"> 批量同步 </el-button>
                                    <el-button v-if="$hasPer('RiskControl:batchStart')" @click="batchHandle(1,getData)" icon="ele-Refresh"> 批量启用 </el-button>
                                    <el-button v-if="$hasPer('RiskControl:batchEnd')" @click="batchHandle(2,getData)" icon="ele-Refresh"> 批量停用 </el-button>
                                    <el-button v-if="$hasPer('RiskControl:batchUpload')" @click="funClick(0)" icon="ele-Upload"> 批量上传 </el-button>
                                    <el-button v-if="$hasPer('RiskControl:batchDown')" @click="funClick(1)" icon="ele-Download"> 模板下载 </el-button>
                                </el-form-item>
                            </el-form>
                        </el-card>
                    </div>

                    <div style="box-sizing: border-box;" class="flex-1 pos-r">
                        <div class="pos-a w-h-100" style="box-sizing: border-box;">
                            <el-card class="box-card w-h-100" shadow="never" style="margin-top: 16px;">
                                <div style="" class="w-h-100 ver-flex">
                                    <div class="flex-1 pos-r">
                                        <div class="pos-a w-h-100">
                                            <el-table 
                                                ref="excelRef"
                                                :data="list" 
                                                class="w-h-100" 
                                                style="width: 100%" border v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.5)"
                                                @selection-change="handleSelectionChange"
                                            >
                                                <el-table-column type="selection" width="55" />

                                                <el-table-column width="80" :show-overflow-tooltip="true" label="待同步"  align="center">
                                                    <template #default="scope">
                                                        <span style="color: #67C23A;" v-if="scope.row.isTobeDS">是</span>
                                                        <span v-else> - </span>
                                                    </template>
                                                </el-table-column>

                                                <!-- <el-table-column type="index" label="序号" width="55" :show-overflow-tooltip="true" align="center" :index="indexMethod" /> -->

                                                <el-table-column min-width="200" :show-overflow-tooltip="true" label="风险分析单元名称"  align="center">
                                                    <el-table-column :show-overflow-tooltip="true" min-width="200" align="center">
                                                        <template #header>
                                                            <SearchModel typeId="i_Name" typeVal="input" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
                                                        </template>
                                                        <template #default="scope">
                                                            <span v-if="scope.row.v_Name">{{ scope.row.v_Name }}</span>
                                                            <span v-else> - </span>
                                                        </template>
                                                    </el-table-column>
                                                </el-table-column>

                                                <el-table-column min-width="200" :show-overflow-tooltip="true" label="风险分析单元类型"  align="center">
                                                    <el-table-column :show-overflow-tooltip="true" min-width="200" align="center">
                                                        <template #header>
                                                            <SearchModel typeId="s_Type" typeVal="select" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
                                                        </template>
                                                        <template #default="scope">
                                                            <span style="color: #67C23A;" v-if="scope.row.n_Type === 0">{{ scope.row.v_TypeName }}</span>
                                                            <span style="color: #E6A23C;" v-if="scope.row.n_Type === 1">{{ scope.row.v_TypeName }}</span>
                                                        </template>
                                                    </el-table-column>
                                                </el-table-column>

                                                <el-table-column min-width="200" :show-overflow-tooltip="true" label="责任部门"  align="center">
                                                    <el-table-column :show-overflow-tooltip="true" min-width="200" align="center">
                                                        <template #header>
                                                            <SearchModel typeId="s_Dep" typeVal="cascader" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
                                                        </template>
                                                        <template #default="scope">
                                                            <span v-if="scope.row.v_ResponsibleDepName">{{ scope.row.v_ResponsibleDepName }}</span>
                                                            <span v-else> - </span>
                                                        </template>
                                                    </el-table-column>
                                                </el-table-column>

                                                <el-table-column min-width="200" :show-overflow-tooltip="true" label="责任人"  align="center">
                                                    <el-table-column :show-overflow-tooltip="true" min-width="200" align="center">
                                                        <template #header>
                                                            <SearchModel typeId="i_Man" typeVal="input" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
                                                        </template>
                                                        <template #default="scope">
                                                            <span v-if="scope.row.v_ResponsibleMan">{{ scope.row.v_ResponsibleMan }}</span>
                                                            <span v-else> - </span>
                                                        </template>
                                                    </el-table-column>
                                                </el-table-column>

                                                <el-table-column min-width="200" :show-overflow-tooltip="true" label="风险等级"  align="center">
                                                    <el-table-column :show-overflow-tooltip="true" min-width="200" align="center">
                                                        <template #header>
                                                            <SearchModel typeId="s_Level" typeVal="select" @searchHandel="searchHandel" :basicsInfo="basicsInfo" />
                                                        </template>
                                                        <template #default="scope">
                                                            <span v-if="scope.row.n_RiskLevel === 0" style="color: #67C23A;">{{ scope.row.v_RiskLevelName }}</span>
                                                            <span v-if="scope.row.n_RiskLevel === 1" style="color: #E6A23C;">{{ scope.row.v_RiskLevelName }}</span>
                                                            <span v-if="scope.row.n_RiskLevel === 2" style="color: #CE7C01;">{{ scope.row.v_RiskLevelName }}</span>
                                                            <span v-if="scope.row.n_RiskLevel === 3" style="color: #FC5400;">{{ scope.row.v_RiskLevelName }}</span>
                                                        </template>
                                                    </el-table-column>
                                                </el-table-column>

                                                <el-table-column min-width="200" :show-overflow-tooltip="true" label="启用状态"  align="center">
                                                    <template #default="scope">
                                                        <span v-if="scope.row.isUse" style="color: #67C23A;">启用</span>
                                                        <span v-if="!scope.row.isUse" style="color: #FC5400;">停用</span>
                                                    </template>
                                                </el-table-column>

                                                <el-table-column min-width="200" :show-overflow-tooltip="true" prop="n_EventCount" label="风险事件数量"  align="center" sortable />

                                                <el-table-column min-width="200" :show-overflow-tooltip="true" prop="n_DCListCount" label="危害因数数量"  align="center" sortable />

                                                <el-table-column min-width="160" :show-overflow-tooltip="true" label="历史变更快照"  align="center" fixed="right">
                                                    <template #default="scope">
                                                        <el-button @click="photoHandel(scope.row)" class="icon-e" icon="ele-View" size="small" text type="primary">查看快照</el-button>
                                                    </template>
                                                </el-table-column>

                                                <el-table-column min-width="180" :show-overflow-tooltip="true" prop="createdTime" label="创建时间"  align="center" sortable>
                                                    <template #default="scope">
                                                        <span v-if="scope.row.createdTime">{{ scope.row.createdTime }}</span>
                                                        <span v-else>-</span>
                                                    </template>
                                                </el-table-column>

                                                <el-table-column min-width="180" :show-overflow-tooltip="true" prop="updatedTime" label="更新时间"  align="center" sortable>
                                                    <template #default="scope">
                                                        <span v-if="scope.row.updatedTime">{{ scope.row.updatedTime }}</span>
                                                        <span v-else>-</span>
                                                    </template>
                                                </el-table-column>
                                                
                                                <el-table-column min-width="180" :show-overflow-tooltip="true" label="最后一次同步时间"  align="center">
                                                    <template #default="scope">
                                                        <span v-if="scope.row.d_InitiateDSTime">{{ scope.row.d_InitiateDSTime }}</span>
                                                        <span v-else> - </span>
                                                    </template>
                                                </el-table-column>
                                                
                                                <el-table-column width="180" :show-overflow-tooltip="true" label="发起同步时间"  align="center">
                                                    <template #default="scope">
                                                        <span v-if="scope.row.d_InitiateDSTime">{{ scope.row.d_InitiateDSTime }}</span>
                                                        <span v-else> - </span>
                                                    </template>
                                                </el-table-column>

                                                <el-table-column width="380" label="操作" align="center" fixed="right">
                                                    <el-table-column :show-overflow-tooltip="true" min-width="450" align="center">
                                                        <template #header>
                                                            <el-button class="icon-e" @click='searchClick' icon="ele-Search" size="small" type="primary" text> 查询 </el-button>
                                                            <el-button class="icon-e clear-bg" style="background-color: transparent !important;" size="small" @click="resetClick" icon="ele-Refresh" text> 重置 </el-button>
                                                        </template>
                                                        <template #default="scope">
                                                            <div class="operate-s">
                                                                <el-button @click="detailHandle(scope.row.id)" class="icon-e" icon="ele-View" size="small" text type="success">详情</el-button>
                                                                <el-button v-if="$hasPer('RiskControl:edit')" @click="nodeClick(scope.row)" class="icon-e" icon="ele-Edit" size="small" text type="warning">编辑</el-button>
                                                                <el-button v-if="!scope.row.isUse && $hasPer('RiskControl:isStart')" @click="documentClick(scope.row,1 ,getData)" class="icon-e" icon="ele-Discount" size="small" text type="primary">是否启用</el-button>
                                                                <el-button v-if="scope.row.isUse && $hasPer('RiskControl:isEdit')" @click="documentClick(scope.row,2, getData)" class="icon-e" icon="ele-Discount" size="small" text type="warning">是否停用</el-button>
                                                                <el-button v-if="$hasPer('RiskControl:adjust')" @click="adjustClick(scope.row,0, getData)" class="icon-e" icon="ele-Discount" size="small" text type="success">调整措施</el-button>
                                                                <el-button v-if="$hasPer('RiskControl:recall')" @click="adjustClick(scope.row,1, getData)" class="icon-e" icon="ele-Discount" size="small" text type="danger">撤回调整</el-button>
                                                            </div>
                                                        </template>
                                                    </el-table-column>
                                                </el-table-column>

                                            </el-table>
                                        </div>
                                    </div>
                                    <div style="height: 30px;margin-top: 20px;" class="hr-flex-start">
                                        <el-pagination
                                            v-model:currentPage="pageNo"
                                            v-model:page-size="pageSize"
                                            :total="totalRows"
                                            :page-sizes="[10, 20, 50, 100]"
                                            small
                                            background
                                            @size-change="handleSizeChange"
                                            @current-change="handleCurrentChange"
                                            layout="total, sizes, prev, pager, next, jumper"
                                            class="w-h-100"
                                        />
                                    </div>
                                </div>
                            </el-card>
                        </div>
                    </div>
                </div>
            </el-col>
        </el-row>
        <EditRiskControl
            :needUrl="needUrl"
            :isView="true"
            :repairInfo="editInfo"
            :isUseDialog="editDialog"
            @updateData="getData"
            @cancelEditClick="cancelEditClick"
        />
        <PhotoView
            :repairInfo="photoInfo"
            :isUseDialog="photoDialog"
            @cancelPhotoClick="cancelPhotoClick"
        />
        <InitJob
            :exaUrl="exaUrl"
            tempId="SmsDCAnalysisUnitApply"
            :repairInfo="initInfo"
            :initDialog="initDialog"
            @updateData="getData"
            @cancelInitClick="cancelInitClick"
            @controlInitClick="controlInitClick"
        />
        <MassUpload
            :isBase="false"
            uploadType="gk"
            :neddUrl="gkUrl"
            :isUseDialog="massDialog"
            @updateData="getData"
            @cancelMassClick="cancelMassClick"
            @controlMassClick="controlMassClick"
        />
        <!-- 详情 -->
        <DetailModel
            :detailInfo="detailInfo"
            :MdetailDialog="MdetailDialog"
            labelWidth="140px"
            @cancelDetailClick="cancelDetailClick"
        />
    </div>
</template>
<script lang="ts">
import { defineComponent, ref, Ref, onMounted , reactive } from 'vue';
import getTableData from '/@/utils/getTableData';
import { 
    SMSDCListPage,
    SMSDCAnalysisUnitPage, 
    SMSDCListDelete, 
    SMSDCRiskPartitionList, 
    SMSDCAnalysisUnitUpdateIsUse, 
    SMSDCAnalysisUnitBathUpdateIsUse, 
    SMSDCAnalysisUnitApplySubimt,
    SMSDCAnalysisUnitApplyRevocation,
    SMSDCAnalysisUnitBathAddByExcel,
    SMSDCAnalysisUnitDetail,
    SMSDCSysDSTaskMaBathAddTasks,
} from '/@/api/centerControl/sms';
import { ElMessageBox , ElMessage } from 'element-plus';
import EditRiskControl from '../component/sms/edit-RiskControl.vue';
import InitJob from '../component/sms/init-job.vue';
import PhotoView from '../component/sms/photo-view.vue';
import MassUpload from '../component/sms/mass-upload.vue';
import { sysOrgTree , sysFileInfoPage } from '/@/api/centerControl/pubilc';
import SearchModel from '../component/search-model.vue';
import DetailModel from '../component/detail-model.vue';
import { confirmFun } from '../component/messageTs';
import { exportToExcel } from '/@/utils/exportToExcel';

export default defineComponent({
    name: 'RiskManagementControl',
    components: {
        EditRiskControl,
        InitJob,
        PhotoView,
        MassUpload,
        SearchModel,
        DetailModel,
    },
    setup(props){
        const selectedItem = ref();
        const areaInfo = ref();
        const initInfo = ref();
        const initDialog = ref(false);
        const photoInfo = ref();
        const photoDialog = ref(false);

        const editInfo = ref();
        const editDialog = ref(false);
        let multipleSelection: any = [];

        const massDialog = ref(false);
        const baseUrl = import.meta.env.VITE_API_URL;

        const cancelEditClick = () => {
            editDialog.value = false;
        }

        /*** 批量同步数据按钮 */
        const syncHandle = (uploadFun: Function) => {
            let setArr: any = [];
            if(multipleSelection.length === 0){
                ElMessage({
                    type: 'warning',
                    message: '请选择需同步的数据',
                });
                return;
            }else{
                confirmFun('是否批量同步已选数据？','提示','warning','取消').then(async(isConfirmed: any) => {
                    if(isConfirmed){
                        // multipleSelection.map((item: any) => {
                        //     if(item.d_LastDSTime !== null){
                        //         setArr.push(item.id);
                        //     }
                        // });
                        let res: any = await SMSDCSysDSTaskMaBathAddTasks({ n_DCSysDSTaskType: 2, l_AppInstanceIds: setArr });
                        if(res.success) uploadFun();
                    }
                });
            }
        }

        /*** nodeClick 新增/编辑点击事件 */
        const nodeClick = (val: any) => {
            editInfo.value = JSON.stringify(val);
            editDialog.value = true;
        };

        /*** getAreaFun 获取分区区域数据 */
        const getAreaFun = async() => {
            let param: any = {};
            let res: any = await SMSDCRiskPartitionList(param);
            if(res.success && res.data.length !== 0) {
                areaInfo.value = res.data;
                searchObj.l_RiskPartitionId = res.data[0].id;
                selectedItem.value = res.data[0].id;
            }
        }

        /*** deleteHandle 删除数据事件 */
        const deleteHandle = async (val: String | Number, updateFun: Function) => {
            ElMessageBox.confirm('请确定删除此条数据？','提示',
                {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                }
            )
            .then(async() => {
                let param = {id : val}
                try {
                    let res:any = await SMSDCListDelete(param);
                    if(res.success){
                        updateFun()
                    }
                } catch (err) { return }
            })
            .catch(() => {
                ElMessage({
                    type: 'info',
                    message: '已取消',
                })
            })
        };

        /*** liClick li点击事件 */
        const liClick = (val: any) => {
            selectedItem.value = val.id;
            searchObj.l_RiskPartitionId = val.id;
        }

        /*** documentClick 单条数据启用/停用 */
        const documentClick = (val:any, num: number , uploadFun: Function) => {
            let setBoole:any;
            let param:any = {};
            param.id = val.id;
            if(num === 1){
                confirmFun('是否启用该条数据？','提示','warning','取消').then((isConfirmed: any) => {
                    if(isConfirmed){
                        param.isUse = true;
                        startEndFun(1,JSON.stringify(param),uploadFun);
                    }
                });
            }else{
                confirmFun('是否停用该条数据？','提示','warning','取消').then((isConfirmed: any) => {
                    if(isConfirmed){
                        param.isUse = false;
                        startEndFun(1,JSON.stringify(param),uploadFun);
                    }
                });
            }
        }
        /*** batchHandle 批量启用/停用 */
        const batchHandle = (num: number , uploadFun: Function) => {
            let param: any = {};
            let setBoole:any;
            let setArr:any = [];
            if(multipleSelection.length === 0){
                ElMessage({
                    type: 'warning',
                    message: '请选择需要更新的数据',
                });
                return;
            }else{
                multipleSelection.map((item: any) => {
                    setArr.push(item.id);
                });
                param.l_Ids = setArr;
            }
            if(num === 1){
                confirmFun('是否批量启用数据？','提示','warning','取消').then((isConfirmed: any) => {
                    if(isConfirmed){
                        param.isUse = true;
                        startEndFun(2,JSON.stringify(param),uploadFun)
                    }
                });
            }else{
                confirmFun('是否批量停用数据？','提示','warning','取消').then((isConfirmed: any) => {
                    if(isConfirmed){
                        param.isUse = false;
                        startEndFun(2,JSON.stringify(param),uploadFun)
                    }
                });
                setBoole = false;
            }
        }
        /*** startEndFun 启用/停用函数 */
        const startEndFun = async(num: number, val: any , uploadFun: Function) => {
            let param = JSON.parse(val);
            let res:any;
            if(num === 1){
                res = await SMSDCAnalysisUnitUpdateIsUse(param);
            }else{
                res = await SMSDCAnalysisUnitBathUpdateIsUse(param);
            }
            if(res.success) uploadFun();
        }
        /*** handleSelectionChange 批量更新的复选框 */
        const handleSelectionChange = (val: any) => {
            multipleSelection = val;
        }

        /*** 查看快照 */
        const photoHandel = (val: any) => {
            photoInfo.value = JSON.stringify(val);
            photoDialog.value = true;
        }

        /*** 措施调整/撤回调整 */
        const adjustClick = async(val: any, num: number, updateFun: Function) => {
            if(num === 0){
                initInfo.value = JSON.stringify(val);
                initDialog.value = true;
            }else{
                let param: any = {};
                param.id = val.id;
                ElMessageBox.confirm('请确定是否撤回调整申请？','提示',
                    {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning',
                    }
                )
                .then(async() => {
                    let param = {id : val.id}
                    try {
                        let res: any = await SMSDCAnalysisUnitApplyRevocation(param);
                        if(res.success){
                            updateFun()
                        }
                    } catch (err) { return }
                })
                .catch(() => {
                    ElMessage({
                        type: 'info',
                        message: '已取消',
                    })
                });
            }
        }

        /*** 查看快照取消事件 */
        const cancelPhotoClick = () => {
            photoDialog.value = false;
        }

        /*** 发起审批取消事件 */
        const cancelInitClick = () => {
            initDialog.value = false;
        }

        /*** 发起审批提交事件 */
        const controlInitClick = () => {
            initDialog.value = false;
        }
        
        /*** 批量上传取消事件 */
        const cancelMassClick = () => {
            massDialog.value = false;
        }

        /*** 批量上传提交事件 */
        const controlMassClick = () => {
            massDialog.value = false;
        }

        /*** 上传/下载点击事件 */
        const funClick = (num: number) => {
            if(num === 0) {massDialog.value = true;}
            if(num === 1){
                // window.open('http://xxxx','_blank') // 打开新页面
                window.location.href = baseUrl + '/Upload/SMS/ExcelTempFiles/安全风险管控清单-导入模板.xlsx'; // 当前页面中打开
            }
        }

        /*** ================================= 详情类数据操作 =================================  */
        const MdetailDialog = ref(false);
        const detailInfo = ref();

        // 获取文件
        const getFileFun = async (sourceId: number) => {
            let param: any = {};
            param.PageNo = 1;
            param.PageSize = 99999;
            param.sourceId = sourceId;
            let res: any = await sysFileInfoPage(param);
            if(res.success) return res.data.rows;
        }
        /*** 获取详情接口数据 */
        const getDetailFun = async (id: number) => {
            let res: any = await SMSDCAnalysisUnitDetail({id: id}); // 详情
            if(res.success){
                let setArr: any = [];
                let tableArr: any = [];
                let detailObjOne: any = {};
                let detailObjTwo: any = {};
                console.log(res.data,'res.data')
                let jobObj = res.data.jobApplyInfo;
                if(jobObj && Object.keys(jobObj).length !== 0){
                    await getFileFun(jobObj.l_FileId).then((item: any) => {
                        if(item.length !== 0){
                            item.map((val: any) => {
                                let itemObj: any = {};
                                itemObj['id'] = val.id;
                                itemObj['fileObjectName'] = val.fileObjectName;
                                itemObj['附件名称'] = val.fileOriginName;
                                itemObj['文件格式'] = val.fileSuffix;
                                itemObj['文件大小'] = val.fileSizeKb;
                                itemObj['文件路径'] = val.filePath;
                                tableArr.push(itemObj);
                            });
                        }
                    });
                    detailObjTwo['作业类型'] = jobObj.v_JobType;
                    detailObjTwo['承包商'] = jobObj.v_ProviderName;
                    detailObjTwo['动工地点'] = jobObj.v_JobAddress;
                    detailObjTwo['计划动工开始日期'] = jobObj.d_IntendedStartTime;
                    detailObjTwo['计划完工日期'] = jobObj.d_IntendedCompletionTime;
                    detailObjTwo['动工内容'] = jobObj.v_JobContent;
                    detailObjTwo['项目名称'] = jobObj.v_ProjectName;
                    detailObjTwo['作业申请编号'] = jobObj.v_ApplyNO;
                    detailObjTwo['申请人员'] = jobObj.v_ApplyEmpName;
                    detailObjTwo['审核状态'] = jobObj.v_FlowinstanceStateName;
                    setArr.push({
                        formTitle: '申请作业基础信息',
                        type: 'form',
                        info: detailObjTwo,
                    },{
                        tableTitle: '作业文档数据',
                        type: 'table',
                        listData: tableArr,
                        minWidth: 160,
                        isShowBtn: true,
                    });
                }
                detailObjOne['风险分析单元类型'] = res.data.v_TypeName;
                detailObjOne['所属风险分区'] = res.data.v_RiskPartitionName;
                detailObjOne['风险分析单元名称'] = res.data.v_Name;
                detailObjOne['责任部门'] = res.data.v_ResponsibleDepName;
                detailObjOne['责任人'] = res.data.v_ResponsibleMan ? res.data.v_ResponsibleMan : '-';
                detailObjOne['是否启用'] = res.data.isUse ? '启用' : '禁用';
                detailObjOne['风险评价方法'] = res.data.v_EvaluationMethod;
                detailObjOne['风险等级'] = res.data.v_RiskLevelName;
                detailObjOne['风险事件数量(个)'] = res.data.n_EventCount;
                detailObjOne['危害因数数量(个)'] = res.data.n_DCListCount;
                setArr.push({
                    formTitle: '分析单元基础信息',
                    type: 'form',
                    info: detailObjOne,
                });
                detailInfo.value = setArr;
                MdetailDialog.value = true;
            }
        }
        /*** 详情 */
        const detailHandle = (id: number) => {
            getDetailFun(id);
        }
        /*** 详情关闭事件 */
        const cancelDetailClick = () => {
            MdetailDialog.value = false;
        }
        /*** ================================= 详情类数据操作 =================================  */
        
        /*** ================================= 查询类数据操作 =================================  */
        let searchObj:any = reactive({
            l_RiskPartitionId: 0
        });
        const basicsInfo: any = ref([]);
        const searInfo: any = ref();

        /*** 获取需要查询的数据 */
        const searchHandel = (val: any) => {
            searInfo.value = val;
        }

        /*** 查询按钮 */
        const searchClick = () => {
            let newObj = Object.keys(searInfo.value);
            if(newObj.length !== 0){
                newObj.map((i:any) => {
                    searchObj[i] = searInfo.value[i];
                });
            }
        };

        /*** 重置按钮 */
        const resetClick = () => {
            searInfo.value = {};
            let newObj = Object.keys(searchObj);
            if(newObj.length !== 0){
                newObj.map((i:any) => {
                    searchObj[i] = ''
                });
            }
            initInfoFun();
        };

        let depArr: any = [];
        // 获取数据
        const getFun = async () => {            
            let ras: any = await sysOrgTree({}); // 获取组织架构列表
            if(ras.success && ras.data.length !== 0) depArr = ras.data;
        }
        
        /*** 初始化数据 */
        const initInfoFun = () => {
            basicsInfo.value = [{
                    typeId: 'i_Name', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
                    typeNam: '', // 输入类型(number,text等) --- 选填
                    searchVal: 'v_Name', // 查询字段 --- 必填
                    defaultVal: '', // 字段默认值 --- 选填
                    placeholder: '分析单元名称', // placeholder数据
                    defaultProp: '', // 下拉框中使用，除下拉框外其它情况为空 --- 选填
                    eventType: 'burl', // 事件类型（如burl/change等） --- 选填
                    defaultEvent: 'nameEvent', // 事件名称 --- 选填
                },{
                    typeId: 's_Dep', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
                    typeNam: '', // 输入类型(number,text等) --- 选填
                    searchVal: 'l_ResponsibleDepId', // 查询字段 --- 必填
                    defaultVal: '', // 字段默认值 --- 选填
                    placeholder: '责任部门', // placeholder数据
                    defaultProp: depArr, // 下拉框中使用，除下拉框外其它情况为空 --- 选填
                    eventType: 'change', // 事件类型（如burl/change等） --- 选填
                    defaultEvent: 'depChange', // 事件名称 --- 选填
                    propsVal: { checkStrictly: true , label: 'title', value: 'id', children: 'children' }, // 级联选择器 --- 选填
                },{
                    typeId: 'i_Man', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
                    typeNam: '', // 输入类型(number,text等) --- 选填
                    searchVal: 'v_ResponsibleMan', // 查询字段 --- 必填
                    defaultVal: '', // 字段默认值 --- 选填
                    placeholder: '负责人', // placeholder数据
                    defaultProp: '', // 下拉框中使用，除下拉框外其它情况为空 --- 选填
                    eventType: 'burl', // 事件类型（如burl/change等） --- 选填
                    defaultEvent: 'manEvent', // 事件名称 --- 选填
                },{
                    typeId: 's_Type', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
                    typeNam: '', // 输入类型(number,text等) --- 选填
                    searchVal: 'n_Type', // 查询字段 --- 必填
                    defaultVal: '', // 字段默认值 --- 选填
                    placeholder: '风险分析单元类型', // placeholder数据
                    defaultProp: [
                        {label: '设备类', value: 0},
                        {label: '作业活动类', value: 1},
                    ], // 下拉框中使用，除下拉框外其它情况为空 --- 选填
                    eventType: 'change', // 事件类型（如burl/change等） --- 选填
                    defaultEvent: 'typeChange', // 事件名称 --- 选填
                },{
                    typeId: 's_Level', // 类型(不能为空，且唯一，与组件中typeId值对应) --- 必填
                    typeNam: '', // 输入类型(number,text等) --- 选填
                    searchVal: 'n_RiskLevel', // 查询字段 --- 必填
                    defaultVal: '', // 字段默认值 --- 选填
                    placeholder: '风险等级', // placeholder数据
                    defaultProp: [
                        {label: '低风险', value: 0},
                        {label: '一般风险', value: 1},
                        {label: '较大风险', value: 2},
                        {label: '重大风险', value: 3}
                    ], // 下拉框中使用，除下拉框外其它情况为空 --- 选填
                    eventType: 'change', // 事件类型（如burl/change等） --- 选填
                    defaultEvent: 'levelChange', // 事件名称 --- 选填
                }
            ]
        }
        
        onMounted(async () => {
            await getAreaFun();
            await getFun();
            initInfoFun(); 
        });
        /*** ================================= 查询类数据操作 =================================  */

        /*** ================================= 导出数据函数操作 ================================= */
        const excelRef: any = ref(null);
        const handleExport = () => {
            if(excelRef.value){
                if(excelRef.value.data.length !== 0){
                    let tableExcel: any = [];
                    let tableArr = excelRef.value.data;
                    tableArr.map((item: any) => {
                        let tableObj: any = {};
                        tableObj['风险分析单元名称'] = item.v_Name ? item.v_Name : '-';
                        tableObj['风险分析单元类型'] = item.v_TypeName ? item.v_TypeName : '-';
                        tableObj['所属风险分区'] = item.v_RiskPartitionName ? item.v_RiskPartitionName : '-';
                        tableObj['责任部门'] = item.v_ResponsibleDepName ? item.v_ResponsibleDepName : '-';
                        tableObj['责任人'] = item.v_ResponsibleMan ? item.v_ResponsibleMan : '-';
                        tableObj['是否启用'] = item.isUse ? '启用' : '禁用';
                        tableObj['风险评价方法'] = item.v_EvaluationMethod ? item.v_EvaluationMethod : '-';
                        tableObj['风险等级'] = item.v_RiskLevelName ? item.v_RiskLevelName : '-';
                        tableObj['风险事件数量(个)'] = item.n_EventCount;
                        tableObj['危害因数数量(个)'] = item.n_DCListCount;
                        tableExcel.push(tableObj);
                    });
                    exportToExcel(tableExcel,'风险管控管理.xlsx');
                }else{
                    ElMessage({
                        type: 'error',
                        message: '暂无数据导出',
                    })
                }
            }
        }
        /*** ================================= 导出数据函数操作 ================================= */

        return {
            ...getTableData(SMSDCAnalysisUnitPage,{},searchObj),
            nodeClick,
            deleteHandle,

            searchOptions: [{
                value: '1',
                label: '培训计划'
            },{
                value: '2',
                label: '考题类型'
            }], // 搜索方式
            areaInfo,
            liClick,
            selectedItem,
            editInfo,
            editDialog,
            cancelEditClick,
            syncHandle,

            batchHandle,
            handleSelectionChange,
            documentClick,
            photoHandel,
            adjustClick,
            initInfo,
            initDialog,
            cancelInitClick,
            controlInitClick,
            exaUrl: SMSDCAnalysisUnitApplySubimt,
            photoInfo,
            photoDialog,
            cancelPhotoClick,
            needUrl: SMSDCListPage,

            funClick,
            gkUrl: SMSDCAnalysisUnitBathAddByExcel,
            massDialog,
            cancelMassClick,
            controlMassClick,

            // 导出Excel
            excelRef,
            handleExport,
            
            // 详情
            MdetailDialog,
            detailHandle,
            detailInfo,
            cancelDetailClick,

            // 查询事件
            basicsInfo,
            searchHandel,
            searchClick,
            resetClick,
        }
    },
} )
</script>
<style lang="scss"> @import '../style/public.scss'; </style>
<style scoped lang="scss">
    #risk-management-control {
        ul {
            list-style: none;
            li {
                cursor: pointer;
                border-bottom: 1px solid rgba(255,255,255,0.1);
                text-align: center;
                padding: 10px 0;
            }
        }
        .active{
            background: rgba(0,0,0,.2)!important;
        }
        .area-l:hover{
            background: rgba(0,0,0,.2)!important;
        }
        .box-f{
            :deep(.el-form-item__label){
                padding: 0;
            }
        }
        :deep(.el-card__body) {
            height: 100%;
        }
        :deep(.el-card){
            border: none !important;
        }
        .upload-demo{
            margin-left: 12px;
            margin-top: 2px;
        }
        .icon-e{
            :deep(.el-icon){
                margin-right: 0px!important;
            }
        }
    }
.clear-bg{
    background-color: transparent !important;
}
</style>